<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" href="js/Hui-iconfont/1.0.8/iconfont.min.css">
		<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
		<script type="text/javascript" src="js/swiper.js"></script>
		<link rel="stylesheet" href="css/demos.css" />
		<link rel="stylesheet" href="css/jquery-weui.css" />
		<link rel="stylesheet" href="css/weui.min.css" />
		<link rel="stylesheet" href="css/index.css" />
		<link rel="stylesheet" href="../londing/londing.css" />
		<script type="text/javascript" src="../londing/londing.js" ></script>
		<script type="text/javascript" src="../londing/shangjia.js" ></script>
		<style type="text/css">

		</style>
	</head>

	<body>
		<div id="main1">
			<div class="shousuo">
				<div class="zitu">

					<i id="aitu" class="icon Hui-iconfont">&#xe6c9</i>
					<div>天津海泰创元发展基地</div>

				</div>
				<div class="input1">
					<input type="text" placeholder="搜索商家、商品" class="input" />
				</div>
			</div>

			<div class="swiper-container">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<div class="kuang1">
							<div class="img">
								<a href="../buy.class/buy.class.html" onclick="getajax()">
									<div><img src="img/2017-03-30_162247.jpg"></div>
									<div>美食</div>
								</a>
							</div>
							<div class="img">
								<div><img src="img/2017-03-30_162307.jpg"></div>
								<div>甜品饮品</div>
							</div>
							<div class="img">
								<div><img src="img/2017-03-30_162400.jpg"></div>
								<div>商品超市</div>
							</div>
							<div class="img">
								<div><img src="img/2017-03-30_162423.jpg"></div>
								<div>下午茶</div>
							</div>
						</div>
						<div class="kuang1">
							<div class="img">
								<div><img src="img/2017-03-30_162435.jpg"></div>
								<div>蔬果生鲜</div>
							</div>
							<div class="img">
								<div><img src="img/2017-03-30_162445.jpg"></div>
								<div>新店特惠</div>
							</div>
							<div class="img">
								<div><img src="img/2017-03-30_162513.jpg"></div>
								<div>准时达</div>
							</div>
							<div class="img">
								<div><img src="img/2017-03-30_162538.jpg"></div>
								<div>土豪推荐</div>
							</div>
						</div>
					</div>
					<div class="swiper-slide">
						<div class="kuang1">
							<div class="img">
								<div><img src="img/2017-03-30_162617.jpg"></div>
								<div>美食</div>
							</div>
							<div class="img">
								<div><img src="img/2017-03-30_162626.jpg"></div>
								<div>鲜花蛋糕</div>
							</div>
							<div class="img">
								<div><img src="img/2017-03-30_162641.jpg"></div>
								<div>日韩料理</div>
							</div>
							<div class="img">
								<div><img src="img/2017-03-30_162653.jpg"></div>
								<div>麻辣烫</div>
							</div>
						</div>
						<div class="kuang1">
							<div class="img" style="width: 25%;">
								<div><img src="img/2017-03-30_162705.jpg"></div>
								<div>披萨拉面</div>
							</div>
							<div class="img" style="width: 25%;">
								<div><img src="img/2017-03-30_163525.jpg"></div>
								<div>汉堡</div>
							</div>
							<div class="img" style="width: 25%;">
								<div></div>
								<div></div>
							</div>
							<div class="img" style="width: 25%;">
								<div></div>
								<div></div>
							</div>
						</div>
					</div>

				</div>
				<!-- Add Pagination -->
				<div class="swiper-pagination"></div>
			</div>

			<!--菜单-->
			<div class="bianju">
				<h3>推荐商家</h3>
				<div class="xiangq" v-for="item in list" @click="href(item.id)" onclick="geta()">
					<div class="z-div-img"><img :src="item.attributes.shopimg" class="shangpintu" /></div>
					<div class="x-div">
						<div class="x-m-div" v-html="item.attributes.shopname"></div>

						<div class="x-d-div">量单 <span v-html="item.attributes.salenum"></span></div>
						<div class="song">
							<div class="q-s-jia">起送价<span v-html="item.attributes.startprice"></span>/ </div>
							<div class="q-s-jia">配送费<span v-html="item.attributes.sendprice"></span></div>
						</div>
					</div>
				</div>

			</div>
		</div>
		<!--选择地址-->
		<div id="main2">
			<div class="thead">
				<img id="leve" src="img/箭头.png" /><span>选择地址</span><span><a href="../dizhi/dizhi.html"><i class="icon Hui-iconfont" style="float: right;margin-right:15px;font-size: 0.8rem;color: white;">&#xe600</i></a></span><br />
				<input placeholder="请选择地址" type="text" id="" value="" />
				
			</div>
			<div class="local">
				<p>默认地址：</p>
				<div class="local1">
					
					<span>张三</span>
                    <span>先生</span>
                    <span>15622655865</span>
                    <div>天津市西青区南开创元</div>
				</div>
			</div>
		</div>
<!--尾部-->
		<div class="weui-tabbar">
			<a href="index.html" class="weui-tabbar__item weui-bar__item--on">

				<div class="weui-tabbar__icon">
					<img src="img/3c52a4dc0ae2021e30f3003085099png.png" alt="">
				</div>
				<p class="weui-tabbar__label">外卖</p>
			</a>
			<a href="../dingdan/dingdan.html" class="weui-tabbar__item">
				<div class="weui-tabbar__icon">
					<img src="img/2017-03-20_130206.png" alt="">
				</div>
				<p class="weui-tabbar__label">订单</p>
			</a>
			<a href="../wode/wode.html" class="weui-tabbar__item">
				<div class="weui-tabbar__icon">
					<img src="img/2017-03-20_130417.png" alt="">
				</div>
				<p class="weui-tabbar__label">我的</p>
			</a>

		</div>
		<div id="loding" style="display: none;">
		<div class="load"></div>
		<div class="load2"></div>
		</div>
		<!-- Swiper JS -->
		<script src="../dist/js/swiper.min.js"></script>
		<link rel="stylesheet" href="css/index1.css" />
		<!-- Initialize Swiper -->
		<script>
			var swiper = new Swiper('.swiper-container', {
				pagination: '.swiper-pagination',
				paginationClickable: true
			});
			$("#aitu").click(function() {
				$("#main2").animate({
					right: '0'
				}, "slow");
				$("html").css("overflow", "hidden");
			});
			$("#leve").click(function() {
				$("#main2").animate({
					right: '-100%'
				}, "slow");
				$("#main1").css("display", "block");
				$("html").css("overflow", "visible");
			});
		</script>
		

		<script src="js/jquery-2.1.4.js"></script>
		<script src="js/fastclick.js"></script>
		<script src="js/jquery-weui.js"></script>
		<script src="js/swiper.js"></script>
		<script src="js/index.js"></script>
		<script src="js/av-min-2.1.2.js"></script>
		<script type="text/javascript" src="js/vue.js"></script>
		<script>
			$(function() {
				FastClick.attach(document.body);
			});
		</script>

		<script>
			$(".swiper-container").swiper({
				loop: true,
				autoplay: 3000
			});
		</script>

		<!--api-->
		<script type="text/javascript">
			var APP_ID = 'c4w6bVvWfh8xxcmkBE1G0gIt-gzGzoHsz';
			var APP_KEY = 'JBikg4Ksk76zcTi5BKYWvTJF';
			AV.init({
				appId: APP_ID,
				appKey: APP_KEY
			});
			var myvue = new Vue({
				el: "body",
				data: {
					list: ""
				},
				methods:{
					href:function(e){
						location.href="../xiangqing/shopmain.html?id="+e
					}
				}
			})
			var query = new AV.Query('ELM_shop');
			query.find().then(function(e) {
				myvue.list = e;
				console.log(e)
					//				var shangpintu = document.getElementsByClassName('shangpintu');
					//				for(var i = 0; i < shangpintu.length; i++){
					//					console.log(e[i].attributes.shopimg);
					//					shangpintu[i].src= e[i].attributes.shopimg;
					//					console.log(shangpintu[i].src);
					//			    }
			})
			
		</script>
	</body>

</html>